<template>
  <div class="list-detail-wrap">
    <div class="list">
      <el-row class="item">
        <div class="title">用户名</div>
        <div class="desc">{{ info.linkname }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">用户电话</div>
        <div class="desc">{{ info.phone }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">公司名称</div>
        <div class="desc">{{ info.companyname }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">详细地址</div>
        <div class="desc">{{ info.detailedaddress }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">设备类型</div>
        <div class="desc">{{ info.enttype }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">支付方式</div>
        <div class="desc">{{ info.paytype === 0 ? '年卡': '微信' }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">经度</div>
        <div class="desc">{{ info.lon }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">纬度</div>
        <div class="desc">{{ info.lat }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">图片列表</div>
        <div class="desc desc-img">
          <div v-for="(item, index) of imgList.result" :key="index" class="img-wrap">
            <img :src="`${baseUrl}/common/viewImage?imagepath=${item}`" :preview="0" preview-text="" alt="" class="images">
          </div>
        </div>
      </el-row>
      <el-row class="item">
        <div class="title">申请时间</div>
        <div class="desc">{{ info.auditdate }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">终止时间</div>
        <div class="desc">{{ info.duedate }}</div>
      </el-row>
      <el-row class="item">
        <div class="title">用户状态</div>
        <div class="desc">{{ info.state === 1 ? '未审核': info.state === 2? '审核通过':'未通过' }}</div>
      </el-row>
    </div>
  </div>
</template>

<script>
import { sellDetail } from '@/api/message'
import base from '@/api/base'
export default {
  name: 'ListDetail',
  data() {
    return {
      baseUrl: base.pro,
      info: {}
    }
  },
  computed: {
    imgList() {
      const result = []
      for (const key in this.info) {
        if (key === 'imgurl') {
          result.push(...this.info.equimgurl.split(','))
        }
      }
      return {
        result
      }
    }
  },
  created() {
    this.init()
  },
  methods: {
    init() {
      const { id } = this.$route.query
      sellDetail(id)
        .then((res) => {
          this.info = res
          console.log(res)
        }).catch((res) => {
          this.$message.error({
            message: '请稍后再试',
            duration: 1000
          })
        })
    }
  }
}
</script>
<style lang="scss" scoped>
.list-detail-wrap {
  width: 100%;
  position: absolute;
  height: 100%;
  overflow-y: scroll;
  top: 0;
  left: 0;
  bottom:0;
  right:0;
  z-index: 20;
  background-color: #fff;
  padding: 20px;
  box-sizing: border-box;
  .list {
    width: 100%;
    border: 1px solid #dcdfe6;
    border-bottom: none;
    box-sizing: border-box;
    .item {
      width: 100%;
      border-bottom: 1px solid #dcdfe6;
      box-sizing: border-box;
      display: flex;
      background-color: #e6effb;
      .title {
        width: 30%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        border-right: 1px solid #dcdfe6;
        box-sizing: border-box;
        color: #757575;
      }
      .desc {
        width: 70%;
        height: 80px;
        line-height: 80px;
        text-align: center;
        color: #757575;
      }
    }
  }
}
</style>
